<template>
  <div>
    <avue-form v-model="examineForm" ref="examineForm" :option="examineOption">
      <template slot-scope="" slot="button">
        <div>
          <el-button
            type="primary"
            size="small"
            icon="el-icon-plus"
            @click="addRejectRecord"
            >添 加</el-button
          >
        </div>
      </template>
    </avue-form>
  </div>
</template>

<script>
import { getRejectList } from "@/api/plugin/workflow/process";
export default {
  name: "wf-exam-form",
  props: {
    process: {
      type: Object,
      default: () => {
        return {};
      },
    },
  },
  watch: {
    process: {
      handler(val) {
        if (!val) return;
        const {
          hideComment,
          hideAttachment,
          hideCopy,
          hideExamine,
          copyUser,
          copyUserName,
        } = val;
        if (hideComment)
          this.findObject(this.examineOption.column, "comment").display = false; // 隐藏评论
        if (hideComment || hideAttachment)
          this.findObject(
            this.examineOption.column,
            "attachment"
          ).display = false; // 隐藏评论附件
        if (hideCopy)
          this.findObject(
            this.examineOption.column,
            "$copyUser"
          ).display = false; // 隐藏抄送人
        if (hideExamine)
          this.findObject(
            this.examineOption.column,
            "$assignee"
          ).display = false; // 隐藏指定下一步审核人
        if (copyUser) this.$set(this.examineForm, "copyUser", val.copyUser); // 默认抄送人
        if (copyUserName)
          this.$set(this.examineForm, "$copyUser", val.copyUserName); // 默认抄送人
      },
      deep: true,
      immediate: true,
    },
    'examineForm.auditType'(nVal, oVal) {
      if (nVal !== oVal) {
        this.examineForm.auditReason = '';
        this.examineForm.auditWay = '';
        this.rejectReason = '';
        this.rejectSolution = '';
      }
    },
  },
  data() {
    return {
      examineForm: {},
      examineOption: {
        menuBtn: false,
        column: [
          {
            label: "驳回类型",
            prop: "auditType",
            type: "select",
            span: 7,
            props: {
              label: "dataItem",
              value: "id",
            },
            dicData: [],
            change: (val) => {
              if (val.value) {
                getRejectList(val.value).then((res) => {
                  const column = this.findObject(
                    this.examineOption.column,
                    "auditReason"
                  );
                  column.dicData = res.data.data;
                  let item = val.column.dicData.find(
                    (item) => item.id === val.value
                  );
                  if (item) {
                    this.rejectTypeName = item.dataItem;
                  }
                });
              }
            },
            // rules: [
            //   {
            //     required: true,
            //     message: "请输入驳回类型",
            //     trigger: "blur",
            //   },
            // ],
          },
          {
            label: "驳回理由",
            prop: "auditReason",
            type: "select",
            span: 7,
            props: {
              label: "dataItem",
              value: "id",
            },
            dicData: [],
            change: (val) => {
              if (val.value) {
                getRejectList(val.value).then((res) => {
                  const column = this.findObject(
                    this.examineOption.column,
                    "auditWay"
                  );
                  column.dicData = res.data.data;
                  let item = val.column.dicData.find(
                    (item) => item.id === val.value
                  );
                  if (item) {
                    this.rejectReason = item.dataItem;
                  }
                });
              }
            },
            // rules: [
            //   {
            //     required: true,
            //     message: "请输入驳回理由",
            //     trigger: "blur",
            //   },
            // ],
          },
          {
            label: "处理方式",
            prop: "auditWay",
            type: "select",
            span: 7,
            props: {
              label: "dataItem",
              value: "id",
            },
            dicData: [],
            change: (val) => {
              let item = val.column.dicData.find(
                (item) => item.id === val.value
              );
              if (item) {
                this.rejectSolution = item.dataItem;
                this.rejectList.push({
                  id: val.value,
                  // rejectTypeName: this.rejectTypeName,
                  // rejectReason: this.rejectReason,
                  // rejectSolution: this.rejectSolution,
                });
              }
            },
            // rules: [
            //   {
            //     required: true,
            //     message: "请输入处理方式",
            //     trigger: "blur",
            //   },
            // ],
          },
          {
            label: "",
            labelWidth:0,
            span: 3,
            prop: "button",
            formslot: true,
          },
          {
            label: "批复意见",
            prop: "comment",
            type: "textarea",
            span: 24,
            event: {
              change: (val) => {
                this.$emit("update:comment", val);
              },
            },
             rules: [{
              required: true,
              message: "请输入批复意见",
              trigger: "blur"
            }],
            display: true,
          },
          {
            label: "附件",
            prop: "attachment",
            type: "upload",
            propsHttp: {
              res: "data",
              url: "link",
              name: "originalName",
            },
            props: {
              label: "name",
              value: "url",
            },
            action: "/api/blade-resource/oss/endpoint/put-file",
            span: 24,
            display: true,
          },
          {
            label: "抄送人",
            prop: "$copyUser",
            placeholder: "请选择 抄送人",
            readonly: true,
            append: "+",
            span: 24,
            event: {
              click: () => {
                this.$emit("user-select", {
                  type: "copy",
                  checkType: "checkbox",
                });
              },
            },
            display: true,
          },
          {
            label: "指定审批人",
            prop: "$assignee",
            placeholder:
              "指定下一级审批人，如不选择则使用默认处理人，驳回时无效。多选时若下一节点为多实例并行则会进行动态加减签，若不是则只有第一个生效。",
            readonly: true,
            append: "+",
            span: 24,
            event: {
              click: () => {
                this.$emit("user-select", {
                  type: "assignee",
                  checkType: "checkbox",
                });
              },
            },
            display: true,
          },
        ],
      },
      rejectTypeName: "",
      rejectReason: "",
      rejectSolution: "",
      rejectList: [], // 驳回节点列表
    };
  },
  created() {
    this.getAudit();
  },
  methods: {
    getComment() {
      return this.examineForm.comment;
    },
    /* 获取第一层驳回类型列表 */
    getAudit() {
      getRejectList().then((res) => {
        const column = this.findObject(this.examineOption.column, "auditType");
        column.dicData = res.data.data;
      });
    },
    /* 新增驳回记录 */
    addRejectRecord() {
      if (!this.rejectTypeName)
        return this.$message({ type: "warning", message: "请选择驳回类型!" });
      if (!this.rejectReason)
        return this.$message({ type: "warning", message: "请选择驳回理由!" });
      if (!this.rejectSolution)
        return this.$message({ type: "warning", message: "请选择处理方式!" });

      this.examineForm.comment += `${this.rejectTypeName},${this.rejectReason},${this.rejectSolution}。\n`;
    },
  },
};
</script>

<style>
</style>